<template>
  <div>
    <div style="margin-bottom: 16px;">
      <RepairInfo :info="repairDetail"></RepairInfo>
    </div>
    <div>
      <RepairProcess :info="repairDetail" :processLists="repairProcessLists"></RepairProcess>
    </div>
  </div>
</template>

<script>
import { initUserInfo } from "@/unit/tool";
import api from "@/server/userConfig";
import RepairInfo from "./components/repairInfo";
import RepairProcess from "./components/repairProcess";

export default {
  name: "SaleDetail",
  components: {
    RepairInfo,
    RepairProcess
  },
  data() {
    return {
      userName: "",
      name: "",
      role: "",
      compId: "",
      repairId: "",
      repairDetail: {},
      repairProcessLists: []
    };
  },
  methods: {
    async getRepair(parames, key) {
      let _this = this;
      const res = await api.getRepair({ ...parames });
      if (res.msgCode !== 0) {
        return;
      }
      this[key] = res.data;
    },

    async getProcess(parames, key) {
      let _this = this;
      const res = await api.getProcess({ ...parames });

      if (res.msgCode !== 0) {
        return;
      }
      this[key] = res.data;
    },
    getData() {
      this.getRepair(
        {
          repairId: this.repairId,
          username: this.userName
        },
        "repairDetail"
      );
      this.getProcess(
        {
          repairId: this.repairId
        },
        "repairProcessLists"
      );
    }
  },
  created() {
    initUserInfo(this);
  },
  mounted() {
    this.repairId = this.$route.params.id;
    this.getData();
  }
};
</script>

<style scoped="scoped"></style>
